<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>开票详情</title>
    <link rel="stylesheet" href="../../zui/css/zui.min.css">
    <link rel="stylesheet" href="../../zui/css/zui-theme.css">
    <link rel="stylesheet" href="../../css/base.css">
    <link rel="stylesheet" href="../../css/main.css">
    <link href="../../zui/lib/datatable/zui.datatable.min.css" rel="stylesheet">
    <link href="../../zui/lib/datetimepicker/datetimepicker.min.css" rel="stylesheet">
</head>
<body style="padding: 10px;">
<div class="section-title" style="margin-bottom: 10px;">
    <span>开票申请详情</span>
</div>
<div class="tab clearfix">
    <div class="left pull-left">
        <ul>
            <li class="active">发票详情</li>
            <li class="">开票状态</li>
        </ul>
    </div>
</div>
<div class="tab-content">
    <div class="item ">
        <div class="panel">
            <div class="panel-heading">
                开票申请信息
            </div>
            <div class="panel-body row">
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>申请编号</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>申请公司</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>发票类型</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    &emsp;&emsp;&emsp;<span class="red">*</span><span>申请时间</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>增值纳税人类型</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                </div>
            </div>
        </div>
        <div class="panel">
            <div class="panel-heading">
                合同信息
            </div>
            <div class="panel-body row">
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>申请编号</span>
                </span>
                        <select name="" id="" class="form-control">
                            <option value=""></option>
                        </select>
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>客户名称</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>纳税人类型</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>客户手机号</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>客户开户行</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>商品名称</span>
                </span>
                        <select name="" id="" class="form-control"></select>
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>服务确认函</span>
                </span>
                        <input type="text" readonly class="form-control">
                        <span class="input-group-btn">
                    <button class="btn">查看</button>
                </span>
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>真实合同附件</span>
                </span>
                        <input type="text" readonly class="form-control">
                        <span class="input-group-btn">
                    <button class="btn">查看</button>
                </span>
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>纳税人识别号</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>一般纳税人资质</span>
                </span>
                        <input type="text" readonly class="form-control">
                        <span class="input-group-btn">
                    <button class="btn">查看</button>
                </span>
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>客户地址</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>开户行账号</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="panel">
            <div class="panel-heading">
                开票信息
            </div>
            <div class="panel-body row">
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>开票金额</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>预交税金</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>税金预交率</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="panel">
            <div class="panel-heading">
                客户地址信息
            </div>
            <div class="panel-body row">
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>收件地址</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>收件人手机号</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    <span class="red">*</span><span>收件人</span>
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                <span class="input-group-addon">
                    客户邮箱地址
                </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-6">合同名称：<span class="red">上海市某某公司 咨询10万</span></div>
            <div class="col-xs-6 text-right">合同金额：<span class="red">100,000,00</span></div>
        </div>
        <hr>
    </div>
    <div class="item" style="display: none;">
        <div class="panel">
            <div class="panel-heading">
                完工成果
            </div>
            <div class="panel-body row">
                <div class="col-xs-6">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>发票张数</span>
                        </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>发票1</span>
                        </span>
                        <input type="text" readonly class="form-control">
                        <span class="input-group-btn">
                            <button class="btn">查看</button>
                        </span>
                        <span class="input-group-btn">
                            <button class="btn">下载</button>
                        </span>
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>上传状态</span>
                        </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
                <div class="col-xs-12">
                    <hr>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>物流单号</span>
                        </span>
                        <input type="text" readonly class="form-control">
                    </div>
                    <br>
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>物流面单</span>
                        </span>
                        <input type="text" readonly class="form-control">
                        <span class="input-group-btn">
                            <button class="btn">查看</button>
                        </span>
                        <span class="input-group-btn">
                            <button class="btn">下载</button>
                        </span>
                    </div>
                </div>
                <div class="col-xs-6">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <span class="red">*</span><span>上传状态</span>
                        </span>
                        <input type="text" readonly class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="panel">
            <div class="panel-heading">
                备注信息
            </div>
            <div class="panel-body row">
                <textarea name="" class="form-control" id="" rows="4"></textarea>
            </div>
        </div>
        <div class="panel">
            <div class="panel-heading">
                操作记录
            </div>
            <div class="panel-body row">
                <table class="table table-bordered">
                    <thead>
                    <tr>
                        <th>处理时间</th>
                        <th>操作</th>
                        <th>状态变更</th>
                        <th>操作员工编号</th>
                        <th>操作员工姓名</th>
                        <th>备注</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>2018-05-04 12:12:12</td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<script src="../../zui/lib/jquery/jquery%20v1.11.0.js"></script>
<script src="../../zui/js/zui.min.js"></script>
<script src="../../zui/lib/datatable/zui.datatable.min.js"></script>
<script src="../../zui/lib/datetimepicker/datetimepicker.min.js"></script>
<script>
    $('.tab li').on('click',function () {
        var index =  $(this).index();
        $(this).addClass('active').siblings().removeClass('active');
        $('.tab-content .item').hide().eq(index).show();
    })
</script>
</body>
</html>
